import Card from "antd/es/card/Card";
import { Button, Checkbox, Form, Input, Select, Space, Spin, InputNumber, Table, DatePicker, Radio } from 'antd';
import React, { useEffect, useRef, useState } from 'react';
import _ from 'lodash';
import { useParams, useHistory } from 'react-router-dom';
import JcdHandle from "../../../../../../utils/apis/JcdHandle";
import FetchHelper from "../../../../../../utils/helper/fetch-helper";
import JcyjApi from "../../../../../../utils/apis/JcyjApi";
import MapPoint from '../../../../../framework/MapPoint';


export default function JcdEdit(props) {
  const dynamicForms = [
    // {
    //   "alias": "创建人",
    //   "name": "createBy",
    //   "type": "input"
    // }, {
    //   "alias": "创建时间",
    //   "name": "createTme",
    //   "type": "input"
    // },
    // {
    //   "alias": "最后更新人",
    //   "name": "updateBy",
    //   "type": "input"
    // },
    // {
    //   "alias": "最后更新时间",
    //   "name": "updateTime",
    //   "type": "input"
    // },
    {
      "alias": "站点名称",
      "name": "zdmc",
      "type": "input"
    },
    {
      "alias": "行政区划名称",
      "name": "xzqhmc",
      "type": "select"
    },
    {
      "alias": "行政区划编码",
      "name": "xzqhbm",
      "type": "select"
    },
    {
      "alias": "预警类别",
      "name": "yhlb",
      "type": "select"
    },
    {
      "alias": "事件类型",
      "name": "jstype",
      "type": "rddio_sj"
    },
    {
      "alias": "事件等级",
      "name": "jbys",
      "type": "rddio"
    },
    {
      "alias": "级别颜色",
      "name": "jbys",
      "type": "input"
    },
    {
      "alias": "经度",
      "name": "jd",
      "type": "input"
    },
    {
      "alias": "纬度",
      "name": "wd",
      "type": "input"
    },
    // {
    //   "alias": "时间",
    //   "name": "sj",
    //   "type": "input"
    // },
    {
      "alias": "预警标题",
      "name": "yjbt",
      "type": "input"
    },
    {
      "alias": "是否发布",
      "name": "isfb",
      "type": "isfbrddio"
    },
    {
      "alias": "预警详细内容",
      "name": "yjxxnr",
      "type": "input"
    },
    {
      "alias": "地理信息",
      "name": "geom",
      "type": "map"
    }
  ]
  const [idDatas, setIdDatas] = useState();
  const [loading, setLoading] = useState();
  const [form] = Form.useForm();
  const [xqDatas, setXqDatas] = useState();
  const [xqJson, setXqJson] = useState({})

  const [params, setParams] = useState({
    pageSize: 10,
    pageNum: 1,
    jcdlx: '河道'
  })
  const id = useParams()?.id;

  //   useEffect(()=>{
  //     JcdHandle.jcdXqDynamicApi().then(datas=>{
  //       setXqDatas(datas)
  //     })
  //   },[])
  useEffect(() => {

    JcyjApi.yjList({ id: id }).then(resp => {
      //console.log('22', ...resp.rows)
      setIdDatas(resp.rows)
      //let xqLookData=JSON.parse(resp.rows.xq)
      form.setFieldsValue(//
        ...resp.rows,
      )
    })
  }, [id, form])

  const history = useHistory();
  const quxiaoHandle = () => {
    history.push(`/manager/yjxxgl`)
  }
  const xzquSelect=(e)=>{
    console.log(e);
    let xzqhbm
    switch(e){
      case '翠屏区':xzqhbm=511502;break;
      case '南溪区':xzqhbm=511503;break;
      case '叙州区':xzqhbm=511504;break;
      case '江安县':xzqhbm=511523;break;
      case '长宁县':xzqhbm=511524;break;
      case '高县':xzqhbm=511525;break;
      case '珙县':xzqhbm=511526;break;
      case '筠连县':xzqhbm=511527;break;
      case '兴文县':xzqhbm=511528;break;
      case '屏山县':xzqhbm=511529;break;
      case '两海新区':xzqhbm=511524;break;
      case '三江新区':xzqhbm=511502;break;
      default:break;
    }
    form.setFieldsValue({ xzqhbm: xzqhbm })
  }
  const onFinish = (values) => {
  
    values.id=id
    values.xq = JSON.stringify(idDatas)
    // 打印 values 以进行调试
    console.log('Submitting values:', values);
    FetchHelper.putJson(`/admin-api/ybyj/yjsjb`, values).then(resp => { alert("修改成功") }).catch(err => { alert("修改失败") })
  }
  return <div className='layout-h h100' style={{
    overflow: "scroll"
  }}>
    <Card className='h100 fill' style={{
      height: "1500px"
    }}>
      <Form method="post"
        onFinish={onFinish}
        form={form}>
        <header style={{
          fontSize: 20,
          fontWeight: "bold"
        }}>预警数据信息</header>
        <hr />

        <div className="InputForm" style={{
          display: "flex",
          flexWrap: "wrap"
        }}>
          {idDatas !== undefined && dynamicForms !== undefined && dynamicForms.map((formItem) => {
            let node;
            switch (formItem.type) {
              case 'select':
                if (formItem.alias === "行政区划名称") {
                  node = <Select onSelect={xzquSelect}>
                    <Select.Option value="翠屏区">翠屏区</Select.Option>
                    <Select.Option value="南溪区">南溪区</Select.Option>
                    <Select.Option value="叙州区">叙州区</Select.Option>
                    <Select.Option value="江安县">江安县</Select.Option>
                    <Select.Option value="长宁县">长宁县</Select.Option>
                    <Select.Option value="高县">高县</Select.Option>
                    <Select.Option value="珙县">珙县</Select.Option>
                    <Select.Option value="筠连县">筠连县</Select.Option>
                    <Select.Option value="兴文县">兴文县</Select.Option>
                    <Select.Option value="屏山县">屏山县</Select.Option>
                    <Select.Option value="两海新区">两海新区</Select.Option>
                    <Select.Option value="三江新区">三江新区</Select.Option>
                  </Select>;
                } else if (formItem.alias === "行政区划编码") {
                  node = <Select>
                    <Select.Option value="511502">511502</Select.Option>
                    <Select.Option value="511503">511503</Select.Option>
                    <Select.Option value="511504">511504</Select.Option>
                    <Select.Option value="511523">511523</Select.Option>
                    <Select.Option value="511524">511524</Select.Option>
                    <Select.Option value="511525">511525</Select.Option>
                    <Select.Option value="511526">511526</Select.Option>
                    <Select.Option value="511527">511527</Select.Option>
                    <Select.Option value="511528">511528</Select.Option>
                    <Select.Option value="511529">511529</Select.Option>
                    {/* <Select.Option value="511503">翠屏区</Select.Option>
                    <Select.Option value="511504">南溪区</Select.Option>
                    <Select.Option value="511505">叙州区</Select.Option>
                    <Select.Option value="511523">江安县</Select.Option>
                    <Select.Option value="511524">长宁县</Select.Option>
                    <Select.Option value="511525">高县</Select.Option>
                    <Select.Option value="511526">珙县</Select.Option>
                    <Select.Option value="511527">筠连县</Select.Option>
                    <Select.Option value="511528">兴文县</Select.Option> */}
                  </Select>;
                }  else {
                  node = <Select>
                    <Select.Option value="地灾">地灾</Select.Option>
                    <Select.Option value="洪涝">洪涝</Select.Option>
                    <Select.Option value="火灾">火灾</Select.Option>
                    <Select.Option value="地震">地震</Select.Option>

                  </Select>;
                }
                break;
              case 'map':
                node = <MapPoint></MapPoint>;
                break;
              case 'rddio':
                node = <Radio.Group>
                  <Radio value="1"> 特别重大事件 </Radio>
                  <Radio value="2"> 重大事件 </Radio>
                  <Radio value="3"> 较大事件 </Radio>
                  <Radio value="4"> 一般事件 </Radio>
                </Radio.Group>;
                break;
              case 'rddio_sj':
                node = <Radio.Group>
                  <Radio value="1"> 应急事件 </Radio>
                  <Radio value="2"> 一般事件 </Radio>
                </Radio.Group>;
                break;
              case 'isfbrddio':
                node = <Radio.Group>
                  <Radio value="0"> 未处理 </Radio>
                  <Radio value="1"> 发布 </Radio>
                  <Radio value="2"> 忽略 </Radio>
                  {/* <Radio value="2"> 归档 </Radio> */}
                </Radio.Group>;
                break;
              case 'input':
              default:
                node = <Input style={{
                  width: "90%"
                }}
                  onChange={(e) => {

                  }}

                />
            }
            return <div style={{
              flexBasis: "33%",
              marginBottom: "10px"
            }}><Form.Item
              label={formItem.alias}
              name={formItem.name}

              rules={[
                {
                  required: true,

                }
              ]}

            >
                {node}
              </Form.Item></div>

          })}

        </div>
        {/* <div className="InputForm" style={{
          display: "flex",
          flexWrap: "wrap"
        }}>
          <header style={{
            fontSize: 20,
            fontWeight: "bold",

          }}>详情编辑:</header>
          <div className="InputForm" style={{
            display: "flex",
            flexWrap: "wrap"
          }}>
            {idDatas !== undefined && xqDatas !== undefined && xqDatas.map((formItem) => {
              let node;
              switch (formItem.type) {
                case 'select':
                  node = <Select></Select>;
                  break;
                case 'input':
                default:
                  node = <Input style={{
                    width: "90%"
                  }}
                    onChange={(e) => {

                    }}

                  />
              }

              return <div style={{
                flexBasis: "33%",
                marginBottom: "10px"
              }}>
                <Form.Item
                  label={formItem.alias}
                  name={['xqJson', formItem.name]}
                >
                  {node}
                </Form.Item></div>

            })}

          </div>
        </div> */}

        <div className="layout-h">
          <Button className="btn1" type="primary"
            htmlType="submit"
          //onClick={baocunHandle}
          >保存</Button>

          <Button onClick={quxiaoHandle} className="btn2">返回</Button>
        </div>
      </Form>
    </Card>
  </div>
}